<template>
    <view>
        <uni-segmented-control :current="menuIndex" :values="menuItems" style-type="text" active-color="#007aff" @clickItem="onClickItem" />

        <view v-if="menuIndex === 0" v-for="(item, index) in serviceItem" style="padding: 10px; margin: 5px; background-color: #ba8d76; border-radius: 10px">
            <uni-card :is-shadow="true" :is-full="false" padding="0" margin="0" @click="() => goToDetailPage(item)">
                <template v-slot:title>
                    <view style="display: flex; justify-content: space-between; font-size: 14px; padding: 10px 0" @click="() => goToDetailPage(item)">
                        <view> {{ index + 1 + "." + item.siName + "  x " + item.cdQuat + item.service.siUnit }}</view>
                    </view>
                </template>
                <view style="flex: 1; justify-content: space-between">
                    <text>客户：{{ item.order.ciName + " " + " - " + " " + item.order.ciPhon }}</text>
                </view>
                <view>
                    <text>加入时间：{{ UTCTimeToLocal(item.cdCrti) }}</text>
                </view>
            </uni-card>
        </view>
        <view v-if="menuIndex === 1" v-for="(item, index) in serviceItem" style="padding: 10px; margin: 5px; background-color: #ba8d76; border-radius: 10px">
            <uni-card :is-shadow="true" :is-full="false" padding="0" margin="0" @click="() => goToDetailPage(item)">
                <template v-slot:title>
                    <view style="display: flex; justify-content: space-between; font-size: 14px; padding: 10px 0" @click="() => goToDetailPage(item)">
                        <view> {{ index + 1 + "." + item.siName + "  x " + item.cdQuat + item.service.siUnit }}</view>
                    </view>
                </template>
                <view style="flex: 1; justify-content: space-between">
                    <text>客户：{{ item.order.ciName + " " + " - " + " " + item.order.ciPhon }}</text>
                </view>
                <view>
                    <text>客户确认状态：{{ item.cdCust }}</text>
                </view>
            </uni-card>
        </view>
        <u-empty v-if="serviceItem.length === 0" text="暂无待服务的项目"> </u-empty>
    </view>
</template>

<script>
import { getMyServedCustomerServiceItemList } from "../../utils/api";
import { mapGetters } from "vuex";

export default {
    data() {
        return {
            serviceItem: {},
            menuItems: ["待服务", "已服务"],
            menuIndex: 0,
        };
    },

    async onLoad(params) {
        let resList = await getMyServedCustomerServiceItemList({ cdSsid: this.staffInfo.orUuid, cdStst: "待确认" });
        if (resList) this.serviceItem = resList || [];
        console.log(resList);
    },

    computed: {
        ...mapGetters({
            staffInfo: "personInfo/staffInfo",
        }),
    },

    methods: {
        goToDetailPage(item) {
            uni.navigateTo({
                url: `customer_current_service_item?crUuid=${item.crUuid}`,
            });
        },

        async onClickItem(e) {
            if (this.menuIndex !== e.currentIndex) {
                this.menuIndex = e.currentIndex;
                if (e.currentIndex == 0) {
                    let resList = await getMyServedCustomerServiceItemList({ cdSsid: this.staffInfo.orUuid, cdStst: "待确认" });
                    if (resList) this.serviceItem = resList || [];
                }
                if (e.currentIndex == 1) {
                    let resList = await getMyServedCustomerServiceItemList({ cdSsid: this.staffInfo.orUuid, cdStst: "已确认" });
                    if (resList) this.serviceItem = resList || [];
                }
            }
        },
    },
};
</script>

<style lang="scss" scoped></style>
